/*
 * @Description: In User Settings Edit
 * @Author: your name
 * @Date: 2019-09-17 18:01:57
 * @LastEditTime: 2019-09-17 18:03:20
 * @LastEditors: Please set LastEditors
 */
//录音按钮
var audioInput = document.getElementById("audioInput");

//中间黑色边框和里面的内容（录音状态）
var blackBoxSpeak = document.querySelector(".blackBoxSpeak");
blackBoxSpeak.style.background = "url('../image/ic_record@2x.png')no-repeat 28 16px/65px 104px, url('../image/ic_record_ripple@2x-9.png')no-repeat 111.2px 32px/28.8px 88px";
blackBoxSpeak.style.backgroundColor = "rgba(0,0,0,.7)";

//中间黑色边框和里面的内容（暂停状态）
var blackBoxPause = document.querySelector(".blackBoxPause");
blackBoxPause.style.background = "rgba(0,0,0,.7) url('../image/ic_release_to_cancel@2x.png')no-repeat center 8px/67.2px 104px";
blackBoxPause.style.backgroundColor = "rgba(0,0,0,.7)";

//手指移动相关
var posStart = 0; //初始化起点坐标
var posEnd = 0; //初始化终点坐标
var posMove = 0; //初始化滑动坐标

//轮播相关
var index = [9, 8, 7, 6, 5, 4, 3, 2, 1, 2, 3, 4, 5, 6, 7, 8, 9];
var num = index.length;
var timer = null; //用于清除计时器

function initEvent() {
	audioInput.addEventListener("touchstart", function(event) {
		setTimer();
		event.preventDefault(); //阻止浏览器默认行为
		posStart = 0;
		posStart = event.touches[0].pageY; //获取起点坐标

		//显示录音 隐藏暂停
		showBlackBoxSpeak();
	});
	audioInput.addEventListener("touchmove", function(event) {
		event.preventDefault(); //阻止浏览器默认行为

		posMove = event.targetTouches[0].pageY; //获取滑动实时坐标
		if(posStart - posMove < 200) {
			//隐藏录音 显示暂停
			showBlackBoxSpeak();
		} else {
			//显示录音 隐藏暂停
			showBlackBoxPause();
		}
	});
	audioInput.addEventListener("touchend", function(event) {
		event.preventDefault(); //阻止浏览器默认行为
		posEnd = 0;
		posEnd = event.changedTouches[0].pageY; //获取终点坐标
		
		clearInterval(timer);
		//初始化状态
		initStatus();

		if(posStart - posEnd < 200) {
			alert("发送成功");
			showBlackBoxNone();
		} else {
			alert("取消发送");
			showBlackBoxNone();
		}
	});
}

initEvent();

//轮播
function setTimer() {
	timer = setInterval(function() {
		setTimeout(function() {
			num++;
			blackBoxSpeak.style.background = "url('../image/ic_record@2x.png')no-repeat 28px 16px/64px 104px, url('../image/ic_record_ripple@2x-" + index[num] + ".png')no-repeat 111.2px 32px/28.8px 88px";
			blackBoxSpeak.style.backgroundColor = " rgba(0,0,0,.7)";
		}, 70);
		if(num >= index.length - 1) {
			num = 0;
		}
	}, 70);
}

//初始化状态
var initStatus = function() {
	audioInput.value = '按住 说话';
	
	//全部隐藏
	showBlackBoxNone();
}

//显示录音 隐藏暂停
var showBlackBoxSpeak = function() {
	audioInput.value = '松开 结束';
	blackBoxSpeak.style.display = "block";
	blackBoxPause.style.display = "none";
}

//隐藏录音 显示暂停
var showBlackBoxPause = function() {
	audioInput.value = '松开手指，取消发送';
	blackBoxSpeak.style.display = "none";
	blackBoxPause.style.display = "block";
}

//隐藏录音
var showBlackBoxNone = function() {
	blackBoxSpeak.style.display = "none";
	blackBoxPause.style.display = "none";
}